import React,{ Component } from 'react'
import { BrowserRouter as Router, Route, Link, Redirect, Switch  } from 'react-router-dom'


const App = () => <h1>我是一营</h1>
const Erying = () => <h1>我是二营</h1>
const Qibinglian = () => <h1>我是骑兵连</h1>
const NotFound = () => <h1>NOT FOUND</h1>

class Test extends Component{
    constructor(props) {
        super(props)
    }
    render(){
        console.log(this.props)
        return <h2>测试组件</h2>
    }
}

function RouterDom() {
    return (
       <div>
           <Router>
               <div>

                    {/* switch 开关，只渲染第一个命中的Route */}
                    <Switch>
                        <Route path="/" exact component={ App } />
                        <Route path="/erying" component={ Erying } />
                        <Route path="/qibinglian" component={ Qibinglian } />
                        <Route path="/404" component={ NotFound } />
                        <Redirect to="/404"/>
                    </Switch>
               </div>
           </Router>
       </div> 
    )
}

export default RouterDom